const path = require("path");
let HtmlWebpackPlugin = require("html-webpack-plugin");
const config = require("./config/config.js");
const VueLoaderPlugin = require('vue-loader/lib/plugin');
let pluginsArr = [];
config.html.forEach((item, index)=> {
    item.minify = {
        removeAttributeQuotes: true, // 是否去除文件中的双引号
        collapseWhitespace: true // 是否去除文件中的空行
    }
    pluginsArr.push(new HtmlWebpackPlugin(item));
});
module.exports = {
    devServer: {
        proxy: {
            '/api': {
                target: 'http://0.0.0.0:80',
                changeOrigin: true,
                pathRewrite: {
                    '^/api': '/api'
                }
            }
        },
        port: 8080, // 指定开发服务器的端口号
        progress: true, // 显示开启本地服务器的进度
        contentBase: "./dist", // 指定本地服务器默认打开的目录
        compress: true, // 是否对代码进行压缩
        inline: true, //实时刷新
        hot: true
    },
    mode: "development",
    entry: config.entry,
    output: {
        filename: "static/js/[name].js",
        path: path.resolve(__dirname, "dist"),
    },
    plugins:[...pluginsArr,new VueLoaderPlugin()],
    module: { // 配置 webpack 使用到的模块
        rules: [
            {
                test: /\.css$/, // 针对 .css 结尾的文件，使用下面的loader进行处理
                use: [{
                        loader: 'style-loader',
                        options: {
                            insertAt: 'top' // 将编译后的css挂载到模板文件的顶部
                        }
                    },
                    'css-loader'
                ]
            },{
                test: /\.scss$/,
                use: [
                    'style-loader',
                    'css-loader',
                    'sass-loader'
                ]
            },
            {
                test: /\.vue$/,
                use: "vue-loader"
            },{
                test: /\.(html)$/,
                use: {
                    loader: 'html-loader',
                    options: {
                    }
                }
            },{
                test: /\.(png|jpg|jpeg|gif|svg)$/,
                use: {
                    loader: 'url-loader',
                    options: {
                        limit: 2 * 1024, // 小于2k的图片，直接使用Base64编码进行处理
                        name: 'static/images/[name].[ext]',
                        esModule: false
                    }
                }
            }
        ],
    },
    resolve: {
        extensions: ['*','.js','.vue','.json']
    }


}
